import { Button } from 'react-vant'
import type { ButtonProps, ButtonType } from 'react-vant'
import { FC, useMemo } from 'react'

export type IButtonType = ButtonType | 'gradient'

interface IButtonProps extends Omit<ButtonProps, 'type'> {
  type?: IButtonType
}

const JButton: FC<IButtonProps> = ({ children, ...props }) => {
  const realProps = useMemo(() => {
    const newProps = { ...props }
    if (newProps.type === 'gradient') {
      newProps.type = 'primary'
      newProps.color = 'linear-gradient(to right, #1AE0E1, #00CBCC)'
    }
    return newProps as ButtonProps
  }, [props])
  return <Button {...realProps}>{children}</Button>
}

export default JButton